﻿@using ZhouYu.NewWorld.Model;
@{
    Layout = null;
    var list = ViewBag.list as List<Scenicspot>;
}

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="renderer" content="webkit|ie-comp|ie-stand" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    @*<link href="~/css/bkg_ui.css" type="text/css" rel="stylesheet" />*@
    <link href="~/css/shop.css" type="text/css" rel="stylesheet" />
    <link href="~/css/Sellerber.css" type="text/css" rel="stylesheet" />

    @*<link href="~/font/css/font-awesome.min.css" rel="stylesheet" type="text/css" /*@
    <link href="~/assets/css/bootstrap.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="~/css/style.css" />
    <link href="~/assets/css/codemirror.css" rel="stylesheet" />
    <link rel="stylesheet" href="~/assets/css/ace.min.css" />
    <link rel="stylesheet" href="~/font/css/font-awesome.min.css" />
    <link rel="stylesheet" href="~/layui-v2.5.4/layui/css/layui.css" media="all" />
    @*<link rel="stylesheet" href="~/css/Pic.css" media="all" />*@
    <!--[if lte IE 8]>
      <link rel="stylesheet" href="assets/css/ace-ie.min.css" />
    <![endif]-->
    <script src="~/Scripts/jquery-1.9.1.min.js"></script>
    <script src="~/assets/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="~/Widget/Validform/5.3.2/Validform.min.js"></script>
    <script src="~/assets/js/typeahead-bs2.min.js"></script>
    <script src="~/assets/js/jquery.dataTables.min.js"></script>
    <script src="~/assets/js/jquery.dataTables.bootstrap.js"></script>
    <script src="~/assets/layer/layer.js" type="text/javascript"></script>
    <script src="~/Scripts/lrtk.js" type="text/javascript"></script>
    <script src="~/assets/layer/layer.js" type="text/javascript"></script>
    <script src="~/assets/laydate/laydate.js" type="text/javascript"></script>
    <script src="~/layui-v2.5.4/layui/layui.js" charset="utf-8"></script>
    <title>用户</title>
</head>
<body>
    <div class="margin inside_pages clearfix">
        <div class="add_style clearfix relative">
            <ul>
                <li class="clearfix"><label class="label_name col-xs-1" style="width:50%"><i>*</i>图片描述：&nbsp;&nbsp;</label><div class="Add_content col-xs-11"><input name="" id="Pic_Desc" type="text" class="col-xs-2" style="margin-left:7%;margin-top:-2.5%" /></div></li>
                <li class="clearfix" style="margin-top:1.5%">
                    <label class="label_name col-xs-1" style="width:50%"><i>*</i>景点选择：&nbsp;&nbsp;</label>
                    <div class="Add_content col-xs-11">
                        <select id="product" style="margin-left:7%;margin-top:-2.5%;width:15%">
                            @for (int i = 0; i < list.Count; i++)
                            {
                                <option value=@list[i].Id>@list[i].ScenicName</option>
                            }
                        </select>
                    </div>
                </li>
                <li class="clearfix" style="margin-top:1.5%">
                    <label class="label_name col-xs-1" style="width:50%"><i>*</i>父级选择：&nbsp;&nbsp;</label>
                    <div class="Add_content col-xs-11">
                        <select id="parentId" style="margin-left:7%;margin-top:-2.5%;width:15%">
                        </select>
                    </div>
                </li>
                <li class="clearfix" style="margin-top:1.5%">
                    <div class="layui-upload">
                        <button class="layui-btn" id="test1" style="margin-left:2%" type="button">上传图片</button>
                        <div class="layui-upload-list" style="margin-left:2%">
                            <img class="layui-upload-img" id="demo1" style="width:200px;height:200px" />
                            <p id="demoText"></p>
                        </div>
                    </div>
                </li>
                <li class="clearfix" style="margin-top:1.5%"><label class="label_name col-xs-1" style="width:50%"><i>*</i>图片排序：&nbsp;&nbsp;</label><div class="Add_content col-xs-11"><input name="" id="Pic_Order" type="text" class="col-xs-2" style="margin-left:7%;margin-top:-2.5%" /></div></li>
                <li class="clearfix" style="margin-top:1.5%">
                    <label class="label_name col-xs-1" style="width:50%"><i>*</i>图片地址：&nbsp;&nbsp;</label>
                    <div class="Add_content col-xs-11">
                        <div class="layui-input-inline">
                            @*<input type="text" id="PicUrl" name="title" placeholder="" autocomplete="off" class="layui-input" style="margin-left:50%;margin-top:-2.5%" />*@
                            <input name="title" id="PicUrl" type="text" class="col-xs-2 layui-input" autocomplete="off" style="margin-left:45%;margin-top:-15%;width:103%;height:5%" />
                        </div>
                    </div>
                </li>
            </ul>
            <form class="layui-form ">
                <ul>
                    <li class="clearfix" style="margin-top:1.5%">
                        <label class="label_name col-xs-1" style="width:50%"><i>*</i>是否主图：&nbsp;&nbsp;</label>
                        <div class="Add_content col-xs-11">
                            <div class="layui-input-block" style="margin-top:-2.8%;margin-left:7%">
                                <input type="checkbox" id="Is_Master" value="1" name="top" lay-text="是|否" lay-skin="switch" />
                            </div>
                        </div>
                    </li>
                    <li class="clearfix" style="margin-top:1.5%">
                        <label class="label_name col-xs-1" style="width:50%"><i>*</i>是否有效：&nbsp;&nbsp;</label>
                        <div class="Add_content col-xs-11" style="margin-top:-2.8%;margin-left:-2.2%">
                            <div class="layui-input-block">
                                <input type="checkbox" id="Pic_Status" value="1" name="state" lay-text="是|否" lay-skin="switch" />
                            </div>
                        </div>
                    </li>
                </ul>
            </form>
        </div>
    </div>
    <div class="Button_operation btn_width">
        <input id="commit" class="layui-btn" type="button" value="保存并添加" />
        <button class="btn button_btn bg-gray" id="exit" type="button">取消添加</button>
    </div>
</body>
</html>
@*<script type="text/html" id="switchShow">
        <input type="checkbox" id="{{d.Id}}" name="State" value="{{d.Enabled}}" lay-skin="switch" lay-text="开|关闭" lay-filter="sexDemo1" {{ d.Enabled == 1 ? 'checked' : '' }} />
    </script>*@
<script src="~/Scripts/Format.js"></script>
<script type="text/javascript">
        //绑定二级菜单
        var data = {};
        data.Scenic_Id = $("#product").val();
        var Parent = $("#parentId");
        $.ajax({
            url: "/Scenicpic/GetParent",
            type: "post",
            data: data,
            success: function (result) {
                var myHTML = "";
                Parent.html("");//赋值之前先清空
                if (result.data != null) {
                    myHTML += "<option value=" + result.data.Pic_Id + ">" + result.data.Pic_Desc + "</option>";
                }
                else {
                    myHTML += "<option value='0'>顶级</option>";
                }
                Parent.append(myHTML);
            }
        });


        $("#product").change(function () {
            //绑定二级菜单
            var data = {};
            data.Scenic_Id = $("#product").val();
            var Parent = $("#parentId");
            $.ajax({
                url: "/Scenicpic/GetParent",
                type: "post",
                data: data,
                success: function (result) {
                    var myHTML = "";
                    Parent.html("");//赋值之前先清空
                    if (result.data != null) {
                        myHTML += "<option value=" + result.data.Pic_Id + ">" + result.data.Pic_Desc + "</option>";
                    }
                    else
                    {
                        myHTML += "<option value='0'>顶级</option>";
                    }
                    Parent.append(myHTML);
                }
            });
        });
      


    //layui数据表格
    layui.use('table', function () {
        var table = layui.table
            , form = layui.form;
        table.render({
            elem: '#test'
            , url: '/UserInfo/GetUserList'
            , cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            , cols: [[
                { type: 'checkbox' }  //这段是加的
                ,{ field: 'User_Id', width: 100, title: '用户Id', align: 'center' }
                , { field: 'User_Name', width: 100, title: '用户名', align: 'center', sort: true  }
                , { field: 'User_NickName', width: 150, title: '昵称', align: 'center', unresize: true }
                , { field: 'User_RealName', title: '真实姓名', width: 150, align: 'center', unresize: true }
                , { field: 'User_Telphone', title: '联系电话', width: 120, align: 'center', unresize: true }
                //, { field: 'Enabled', width: 150, title: '显示', align: 'center', templet: '#switchShow', unresize: true }
                , { field: 'User_Email', title: '邮箱', width: 120, align: 'center', unresize: true }
                , { field: 'User_LoginIp', title: '登录Ip', width: 120, align: 'center', unresize: true }
                , { field: 'User_Adress', title: '地址', width: 120, align: 'center', unresize: true }
                , { field: 'User_CreateTime', title: '创建时间', width: 180, templet: "<div>{{Format(d.User_CreateTime,'yyyy-MM-dd hh:mm:ss')}}</div>" }
                , { field: 'User_UpdateTime', title: '修改时间', width: 180, templet: "<div>{{Format(d.User_UpdateTime,'yyyy-MM-dd hh:mm:ss')}}</div>"}
                , { fixed: 'right', title: '操作', width: 180, align: 'center', toolbar: '#barDemo' }
            ]]
            , page: true
            , id: 'testReload'
        });
    });
    jQuery(function ($) {
        var oTable1 = $('#sample_table').dataTable({
            "aaSorting": [[1, "desc"]],//默认第几个排序
            "bStateSave": true,//状态保存
            "aoColumnDefs": [
                //{"bVisible": false, "aTargets": [ 3 ]} //控制列的隐藏显示
                { "orderable": false, "aTargets": [0, 2, 3, 4, 5, 7, 8,] }// 制定列不参与排序
            ]
        });


        $('table th input:checkbox').on('click', function () {
            var that = this;
            $(this).closest('table').find('tr > td:first-child input:checkbox')
                .each(function () {
                    this.checked = that.checked;
                    $(this).closest('tr').toggleClass('selected');
                });

        });


        $('[data-rel="tooltip"]').tooltip({ placement: tooltip_placement });
        function tooltip_placement(context, source) {
            var $source = $(source);
            var $parent = $source.closest('table')
            var off1 = $parent.offset();
            var w1 = $parent.width();

            var off2 = $source.offset();
            var w2 = $source.width();

            if (parseInt(off2.left) < parseInt(off1.left) + parseInt(w1 / 2)) return 'right';
            return 'left';
        }
    });

</script>
<script type="text/javascript">
    layui.use('upload', function () {
        var $ = layui.jquery
            , upload = layui.upload;
        //普通图片上传
        var uploadInst = upload.render({
            elem: '#test1'
            , url: '/Scenicpic/UploadImage'
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                    $('#demo1').attr('src', result); //图片链接（base64）
                });
            }
            , done: function (res) {
                //如果上传失败
                if (res.code > 0) {
                    return layer.msg('上传失败');
                }
                else {
                    //上传成功,获取图片路径
                    $("#PicUrl").val("http://39.100.50.152:8081"+res.FilePath);
                }
            }
            //    , error: function () {
            //        //演示失败状态，并实现重传
            //        var demoText = $('#demoText');
            //        demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
            //        demoText.find('.demo-reload').on('click', function () {
            //            uploadInst.upload();
            //        });
            //    }
            //});
        });
    });
    $("#exit").click(function () {
        window.location.href="/Home/ScenicPic"
    });

     //添加按钮点击事件
    $("#commit").click(function () {
        var data = {};
        data.Scenic_Id = $("#product").val();
        data.Pic_Desc = $("#Pic_Desc").val();
        data.Pic_Url = $("#PicUrl").val();
        data.ParentId = $("#parentId").val();
        data.Is_Master = 0;
        if ($("#Is_Master").prop("checked"))
        {
            data.Is_Master = 1;
        }
        data.Pic_Status = 0;
        if ($("#Pic_Status").prop("checked"))
        {
            data.Pic_Status = 1;
        }
        data.Pic_Order = $("#Pic_Order").val();
        $.ajax({
            url: "/Scenicpic/AddScenicpic",
            type: "post",
            data:data,
            success: function (result) {
                if (result.Success) {
                    layer.msg('新增成功！',
                        {
                            icon: 1,
                            time: 2000,
                            shade: 0.2
                        }, function () {
                            window.location.href="/Home/ScenicPic"
                        });
                }
                else
                {
                    layer.msg('新增失败！',
                    {
                            icon: 1,
                            time: 2000,
                            shade: 0.2
                    });
                }
            }
        })
    });


    $(function () {
        $("#administrator").fix({
            float: 'left',
            //minStatue : true,
            skin: 'green',
            durationTime: false,
            spacingw: 50,//设置隐藏时的距离
            spacingh: 270,//设置显示时间距
        });
    });
    //字数限制
    function checkLength(which) {
        var maxChars = 100; //
        if (which.value.length > maxChars) {
            layer.open({
                icon: 2,
                title: '提示框',
                content: '您输入的字数超过限制!',
            });
            // 超过限制的字数了就将 文本框中的内容按规定的字数 截取
            which.value = which.value.substring(0, maxChars);
            return false;
        } else {
            var curr = maxChars - which.value.length; //250 减去 当前输入的
            document.getElementById("sy").innerHTML = curr.toString();
            return true;
        }
    };



    //初始化宽度、高度
    $(".widget-box").height($(window).height() - 215);
    $(".table_menu_list").width($(window).width() - 260);
    $(".table_menu_list").height($(window).height() - 215);
    //当文档窗口发生改变时 触发
    $(window).resize(function () {
        $(".widget-box").height($(window).height() - 215);
        $(".table_menu_list").width($(window).width() - 260);
        $(".table_menu_list").height($(window).height() - 215);
    })
    //laydate({
    //    elem: '#start',
    //    event: 'focus'
    //});

    /*用户-停用*/
    function member_stop(obj, id) {
        layer.confirm('确认要停用吗？', function (index) {
            $(obj).parents("tr").find(".td-manage").prepend('<a style="text-decoration:none" class="btn btn-xs " onClick="member_start(this,id)" href="javascript:;" title="启用"><i class="fa fa-close bigger-120"></i></a>');
            $(obj).parents("tr").find(".td-status").html('<span class="label label-defaunt radius">已停用</span>');
            $(obj).remove();
            layer.msg('已停用!', { icon: 5, time: 1000 });
        });
    }
    /*用户-启用*/
    function member_start(obj, id) {
        layer.confirm('确认要启用吗？', function (index) {
            $(obj).parents("tr").find(".td-manage").prepend('<a style="text-decoration:none" class="btn btn-xs btn-success" onClick="member_stop(this,id)" href="javascript:;" title="停用"><i class="fa fa-check  bigger-120"></i></a>');
            $(obj).parents("tr").find(".td-status").html('<span class="label label-success radius">已启用</span>');
            $(obj).remove();
            layer.msg('已启用!', { icon: 6, time: 1000 });
        });
    }
    /*产品-编辑*/
    function member_edit(title, url, id, w, h) {
        layer_show(title, url, w, h);
    }

    /*产品-删除*/
    function member_del(obj, id) {
        layer.confirm('确认要删除吗？', function (index) {
            $(obj).parents("tr").remove();
            layer.msg('已删除!', { icon: 1, time: 1000 });
        });
    }



</script>

